$(function () {
    let sData = [];
    $.ajax({
        method: 'GET',
        url: BigNew.baseURL + "/admin/data/info",
        data: {},
        success: (res) => {
            let sp = $(".spannel");
            sp.eq(0).find("em").text(res.totalArticle);
            sp.eq(1).find("em").text(res.dayArticle);
            sp.eq(2).find("em").text(res.totalComment);
            sp.eq(3).find("em").text(res.dayComment);
        }
    })

    $.ajax({
        method: 'GET',
        url: BigNew.baseURL + "/admin/data/category",
        data: {},
        success: (res) => {
            console.log(res);
            res.data = JSON.parse(JSON.stringify(res.date).replace(/articles/g, 'value'));
            console.log(res.data);
            let lData = [];
            res.data.forEach(function (item) {
                lData.push(item.name);
            })


            showPie(lData, res.data)
        }
    })
    // 环形图
    function showPie(lData, sData) {

        // 基于准备好的dom，初始化echarts实例
        var myPieChart = echarts.init(document.getElementById('pie_show'));

        option1 = {
            title: {
                left: 'center',
                text: '分类文章数量比',
            },
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'horizontal',
                x: 'center',
                data: lData,
                top: 25
            },
            // color: ['#5885e8', '#13cfd5', '#00ce68', '#ff9565', '#20ff19'],
            series: [
                {
                    name: '分类名称',
                    type: 'pie',
                    radius: ['30%', '70%'],
                    avoidLabelOverlap: false,
                    label: {
                        emphasis: {
                            show: true,
                            textStyle: {
                                fontSize: '30',
                                fontWeight: 'bold'
                            }
                        }
                    },
                    data: sData,
                }
            ]
        };
        // 使用刚指定的配置项和数据显示图表。
        myPieChart.setOption(option1);
    }

    // <!-- 柱状图 -->
    // 基于准备好的dom，初始化echarts实例

    function showBar(lData, sData) {
        var myChart2 = echarts.init(document.getElementById('column_show'));

        option2 = {
            title: {
                left: 'center',
                text: '分类访问量',
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'line'        // 默认为直线，可选为：'line' | 'shadow'
                },

            },
            legend: {
                data: lData,
                top: 30
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    data: ['一月', '二月', '三月', '四月']
                }
            ],
            yAxis: [
                {
                    type: 'value'
                }
            ],
            // color: ['#5885e8', '#13cfd5', '#00ce68', '#ff9565', '#20ff19'],
            series: [
                {
                    name: '爱生活',
                    type: 'bar',
                    data: [320, 332, 301, 334]
                },
                {
                    name: '趣美味',
                    type: 'bar',
                    data: [220, 132, 101, 134]
                },
                {
                    name: '爱旅行',
                    type: 'bar',
                    data: [220, 182, 191, 234]
                },
                {
                    name: '爱电影',
                    type: 'bar',
                    data: [150, 232, 201, 154]
                },
                {
                    name: '爱游泳',
                    type: 'bar',
                    data: [262, 118, 364, 426],
                },

            ]
        };


        // 使用刚指定的配置项和数据显示图表。
        myChart2.setOption(option2);
    }



})